<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>业务指标墙</title>
    <link rel="stylesheet" href="./static/css/home.css" />
       <link rel="stylesheet" href="./static/css/swiper-bundle.min.css" />
</head>
<body>
    <div class="content">
        <div class="top">
            <img src="./static/img/title.png" alt="" />
        </div>
        <div class="swiper-container">
            <div class="swiper-wrapper">
              <div class="swiper-slide">
                    <div class="wrapper">
                        <div class="blue_bg">
                            <div class="section leftToPBox ">
                                <div class="text">路网</div>
                                <div class="textValue keyun_average"></div>
                                <div class="unit"> 客运线路强度<span>(万乘次/公里*日)</span></div>
                                <div class="sectionEchart keyun_chart"></div>
                            </div>
                            <div class="section leftCenterBox">
                                <div class="text">路网</div>
                                <div class="textValue line_average"></div>
                                <div class="unit">线路平均运距<span>(公里)</span></div>
                                <div class="sectionEchart line_chart"></div>
                            </div>
                            <div class="section leftbottomBox">
                                <div class="text">平均</div>
                                <div class="textValue yanwu_average"></div>
                                <div class="unit"> 五分钟延误事件频次</div>
                                <div class="sectionEchart yanwu_chart"></div>
                            </div>
                        </div>
                        <div class="blue_bg">
                            <div class="section leftToPBox ">
                                <div class="text">平均</div>
                                <div class="textValue zhengdian_average"></div>
                                <div class="unit">正点率<span>(月累计)</span></div>
                                <div class="sectionEchart zhengdian_box"></div>
                            </div>
                            <div class="section leftCenterBox">
                                <div class="text">平均</div>
                                <div class="textValue duixian_average"></div>
                                <div class="unit">兑现率<span>(月累计)</span></div>
                                <div class="sectionEchart duixian_box"></div>
                            </div>
                            <div class="section leftbottomBox">
                                <div class="text">单日</div>
                                <div class="textValue change_average"></div>
                                <div class="unit">票务收入变化趋势图<span>(万元)</span></div>
                                <div class="sectionEchart changeChart"></div>
                            </div>
                        </div>
                        <div class="green-bg">
                            <div class="section leftToPBox ">
                                <div class="text">最高</div>
                                <div class="textValue shigong_duixian_max"></div>
                                <div class="unit"> 施工兑现率<span>(含临时)</span></div>
                                <div class="sectionEchart shigongDChart"></div>
                            </div>
                            <div class="section leftCenterBox">
                                <div class="text">最高</div>
                                <div class="textValue shigong_plan_max"></div>
                                <div class="unit">施工计划工时利用率<span>(含临时)</span></div>
                                <div class="sectionEchart shigongPChart"></div>
                            </div>
                            <div class="section leftbottomBox">
                                <div class="text">最高</div>
                                <div class="textValue shigong_change_max"></div>
                                <div class="unit"> 施工变更率<span>(含临时)</span></div>
                                <div class="sectionEchart shigongCChart"></div>
                            </div>
                        </div>
                        <div class="yellow_bg">
                            <div class="section leftToPBox ">
                                <div class="text">平均</div>
                                <div class="textValue jindu_average">1.06</div>
                                <div class="unit">进度完成情况</div>
                                <div class="sectionEchart jinduChart"></div>
                            </div>
                            <div class="section leftCenterBox">
                                <div class="text">平均</div>
                                <div class="textValue zhiliang_average">98%</div>
                                <div class="unit">质量检查完成情况</div>
                                <div class="sectionEchart zhiliangChart"></div>
                            </div>
                            <div class="section leftbottomBox">
                                <div class="text">平均</div>
                                <div class="textValue touzi_average">59.45%</div>
                                <div class="unit">投资完成率</div>
                                <div class="sectionEchart touziChart"></div>
                            </div>
                        </div>
                    </div>
                    <div class="wrapper">
                        <div class="purple-bg">
                            <div class="section leftToPBox ">
                                <div class="text">最高</div>
                                <div class="textValue lineStationNum_max"></div>
                                <div class="unit">线路车站数</div>
                                <div class="sectionEchart lineStationNum_chart"></div>
                            </div>
                            <div class="section leftCenterBox">
                                <div class="text textMore">日最均高</div>
                                <div class="textValue linePassengerV_max"></div>
                                <div class="unit">线路客运量<span>(万乘次/日)</span></div>
                                <div class="sectionEchart linePassengerVChart"></div>
                            </div>
                            <div class="section leftbottomBox">
                                <div class="text">最高</div>
                                <div class="textValue heightSetionflow_max"></div>
                                <div class="unit">高峰小时高断面客流量<span>(万人次/h)</span></div>
                                <div class="sectionEchart heightSetionflow_chart"></div>
                            </div>
                        </div>
                        <div class="purple-bg">
                            <div class="section leftToPBox ">
                                <div class="text textMore" style="width: 38px;">上季度平均</div>
                                <div class="textValue peakMaxCongest_average"></div>
                                <div class="unit">高峰小时最大拥挤度<span>(%)</span></div>
                                <div class="sectionEchart peakMaxCongest_chart"></div>
                            </div>
                            <div class="section leftCenterBox">
                                <div class="text">最高</div>
                                <div class="textValue averageDailyPassNum_max"></div>
                                <div class="unit"> 日均客运周转量<span>(万乘次公里/日)</span></div>
                                <div class="sectionEchart averageDailyPassNum_chart"></div>
                            </div>
                            <div class="section leftbottomBox">
                                <div class="text">最高</div>
                                <div class="textValue averageDailyOpera_max"></div>
                                <div class="unit">日均运营里程</div>
                                <div class="sectionEchart averageDailyOpera_chart"></div>
                            </div>
                        </div>
                        <div class="purple-bg">
                            <div class="section leftToPBox ">
                                <div class="text textMore">上车线辆</div>
                                <div class="textValue lineVehiclesNum_num"></div>
                                <div class="unit">线路车辆数<span>(列)</span></div>
                                <div class="sectionEchart lineVehiclesNum_chart"></div>
                            </div>
                            <div class="section leftCenterBox">
                                <div class="text">最高</div>
                                <div class="textValue additionalTrains_max"></div>
                                <div class="unit">加开列次</div>
                                <div class="sectionEchart additionalTrains_chart"></div>
                            </div>
                            <div class="section leftbottomBox">
                                <div class="text">最高</div>
                                <div class="textValue totalMileage_max"></div>
                                <div class="unit">总行驶里程<span>(万车公里)</span></div>
                                <div class="sectionEchart totalMileage_chart"></div>
                            </div>
                        </div>
                        <div class="purple-bg">
                            <div class="section leftToPBox ">
                                <div class="text textMore">实最际高</div>
                                <div class="textValue trainNumber_average"></div>
                                <div class="unit">开行列次</div>
                                <div class="sectionEchart trainNumber_chart"></div>
                            </div>
                            <div class="section leftCenterBox">
                                <div class="text textMore">上车线辆</div>
                                <div class="textValue numLineVehicles_num"></div>
                                <div class="unit">线路车辆数<span>(辆)</span></div>
                                <div class="sectionEchart numLineVehicles_chart"></div>
                            </div>
                            <div class="section leftbottomBox">
                                <div class="text">最高</div>
                                <div class="textValue onTimeTrain_max"></div>
                                <div class="unit">准点列车次数</div>
                                <div class="sectionEchart onTimeTrain_chart"></div>
                            </div>
                        </div>
                    </div>
                    <div class="wrapper">
                        <div class="blue_bg">
                            <div class="section leftToPBox ">
                                <div class="text">平均</div>
                                <div class="textValue fare_average"></div>
                                <div class="unit">平均票价<span>(元)</span></div>
                                <div class="sectionEchart fare_chart"></div>
                            </div>
                            <div class="section leftCenterBox">
                                <div class="text">平均</div>
                                <div class="textValue productivity_average"></div>
                                <div class="unit">全员生产率</div>
                                <div class="sectionEchart productivity_chart"></div>
                            </div>
                            <div class="section leftbottomBox">
                                <div class="text">最长</div>
                                <div class="textValue departureInterval_average"></div>
                                <div class="unit">高峰小时最小发车间隔<span>(秒)</span></div>
                                <div class="sectionEchart departureInterval_chart"></div>
                            </div>
                        </div>
                        <div class="blue_bg">
                            <div class="section leftToPBox ">
                                <div class="text">平均</div>
                                <div class="textValue passengerVolume_average">43.21</div>
                                <div class="unit"> 日均客流量<span>(万乘次/日)</span></div>
                                <div class="sectionEchart passengerVolume_chart" id="passengerVolume_chart"></div>
                            </div>
                            <div class="section leftCenterBox">
                                <div class="text">平均</div>
                                <div class="textValue reliability_average">9.89</div>
                                <div class="unit"> 列车运行可靠度<span>(万列公里/件)</span></div>
                                <div class="sectionEchart reliability_chart" id="reliability_chart"></div>
                            </div>
                            <div class="section leftbottomBox">
                                <div class="text">平均</div>
                                <div class="textValue vehicleOnlineRate_average">76%</div>
                                <div class="unit">列车上线率</div>
                                <div class="sectionEchart vehicleOnlineRateChart" id="vehicleOnlineRateChart"></div>
                            </div>
                        </div>
                        <div class="green-bg">
                            <div class="section leftToPBox ">
                                <div class="text">最高</div>
                                <div class="textValue constructionStandard_average"></div>
                                <div class="unit">施工规范率<span>(含临时)</span></div>
                                <div class="sectionEchart constructionStandard_chart"></div>
                            </div>
                            <div class="section leftCenterBox">
                                <div class="text">平均</div>
                                <div class="textValue vehicleAvailability_average">50%</div>
                                <div class="unit">列车可用率</div>
                                <div class="sectionEchart vehicleAvailabilityChart" id="vehicleAvailabilityChart"></div>
                            </div>
                            <div class="section leftbottomBox">
                                <div class="text">最多</div>
                                <div class="textValue allocatedVehiclesNum_max">60</div>
                                <div class="unit">配属车辆数<span>(辆)</span></div>
                                <div class="sectionEchart allocatedVehiclesNumChart" id="allocatedVehiclesNumChart"></div>
                            </div>
                        </div>
                        <div class="yellow_bg">
                            <div class="section leftToPBox ">
                                <div class="text textMore">实最际低</div>
                                <div class="textValue civilEngineeringComple_min">77.12%</div>
                                <div class="unit">土建工程完成率</div>
                                <div class="sectionEchart civilEngineeringCompleChart" id="civilEngineeringCompleChart"></div>
                            </div>
                            <div class="section leftCenterBox">
                                <div class="text">最高</div>
                                <div class="textValue installationDebug_max">90.28%</div>
                                <div class="unit">机电安装调试完成率</div>
                                <div class="sectionEchart installationDebugChart" id="installationDebugChart"></div>
                            </div>
                            <div class="section leftbottomBox">
                                <div class="text">最低</div>
                                <div class="textValue qualifiedCivilEngine_min">100%</div>
                                <div class="unit">土建工程合格率</div>
                                <div class="sectionEchart qualifiedCivilEngineChart" id="qualifiedCivilEngineChart"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="swiper-pagination"></div>
        </div>
    </div>
    <script src="./static/js/jquery-3.4.1.min.js"></script>
    <script src="./static/js/echarts.min.js"></script>
    <script src="./static/js/echarts-liquidfill.min.js"></script>

    <script src="https://unpkg.com/dayjs@1.8.34/dayjs.min.js"></script>
    <script src="./static/js/const_config.js"></script>

    <script src="./static/js/index.js"></script>
    <script src="./static/js/indexSecond.js"></script>
    <script src="./static/js/indexThree.js"></script>
    <script src="./static/js/four_screen.js"></script>  
    <script src="./static/js/swiper-bundle.min.js"></script>
    <script>
        var swiper = new Swiper(".swiper-container", {
          slidesPerView: 1,
          spaceBetween: 20,
          loop: true,
          pagination: {
            el: ".swiper-pagination",
            clickable: true,
          },
        //   autoplay: {
        //     delay: 15000,
        //     disableOnInteraction: false,
        //   },
        });
      </script>
</body>
</html>